chore: minor updates - deps, lint, and CSS organisation by michellepace · Pull Request #13 · michellepace/nextjs-base

michellepace · 2025-12-02T10:21:41Z

Summary

Enable Cache Components (cacheComponents: true) for Next.js 16's opt-in caching model
with PPR, "use cache" directive, cacheLife(), and cacheTag() APIs
Update dependencies: next 16.0.5→16.0.6, @vercel/analytics 1.5→1.6,
@vercel/speed-insights 1.2→1.3
Add --error-on-warnings to biome lint script for stricter checks
Reorganise globals.css structure and update mono font fallback to ui-monospace

Test plan

Verify build passes (npm run build)
Check dark/light theme toggle works
Confirm fonts render correctly (display, serif, mono)

🤖 Generated with Claude Code

- Add cacheComponents: true to enable Partial Prerendering (PPR), "use cache" directive, cacheLife(), and cacheTag() APIs - Remove placeholder comment Enables Next.js 16's opt-in caching model where routes are dynamic by default. Static content and cached data can be included in the prerendered shell using "use cache" with Suspense boundaries for streaming dynamic content. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>

Dependencies: - next 16.0.5 → 16.0.6 - @vercel/analytics 1.5.0 → 1.6.0 - @vercel/speed-insights 1.2.0 → 1.3.0 Lint: - Add --error-on-warnings flag to biome check - Update biome.json schema to 2.3.8 Warnings now fail the lint script, enforcing stricter code quality checks. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>

@theme

CSS Structure: - Move @theme inline block before :root for logical flow (import → theme registration → variable definitions → dark overrides → base styles) - Group @theme inline contents: fonts, radii, then colours - Remove blank lines in :root/.dark for denser formatting Font: - Change mono fallback from "Courier New" to ui-monospace (uses system mono) Import: - Use @/ alias for globals.css import in layout.tsx File structure now follows: Tailwind import → variant setup → theme tokens → CSS variables → base styles. The ui-monospace fallback uses the OS's native monospace font rather than the dated Courier New. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>

vercel · 2025-12-02T10:21:45Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
nextjs-base	Ready	Preview	Comment	Dec 2, 2025 10:21am

coderabbitai · 2025-12-02T10:21:50Z

Summary by CodeRabbit

Release Notes

Chores
- Updated analytics and speed monitoring dependencies to latest versions for improved tracking and insights.
- Bumped Next.js framework version for enhanced stability and performance.
- Enhanced code quality standards by implementing stricter linting enforcement.
Style
- Refined theme token definitions and colour variable configurations for improved visual consistency.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

Walkthrough

This pull request updates the project's theme token definitions in globals.css, modifies the stylesheet import path in layout.tsx to use absolute aliases, enables component caching in Next.js configuration, upgrades Biome schema version, and bumps minor versions of Next.js and Vercel packages whilst tightening linting rules.

Changes

Cohort / File(s)	Summary
Theming & Styling `app/globals.css`, `app/layout.tsx`	Restructured `@theme` inline block with updated token mappings; changed font-mono fallback to ui-monospace; reorganised colour variables. Import path changed from relative to absolute alias.
Build & Runtime Configuration `next.config.ts`, `biome.json`	Added cacheComponents option to enable component caching and related cache directives in Next.js config. Upgraded Biome schema version from 2.3.7 to 2.3.8.
Package Management `package.json`	Updated lint script with --error-on-warnings flag; bumped `@vercel/analytics` to ^1.6.0, `@vercel/speed-insights` to ^1.3.0, and next to ^16.0.6.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Verify globals.css theme token mappings are correct and complete after reorganisation
Confirm the absolute import alias resolves correctly in all environments
Validate cacheComponents configuration aligns with Next.js documentation for the current version

Possibly related PRs

feat: adopt shadcn/ui default theme system #12: Overhauls theme token definitions and layout-level configuration alongside globals.css restructuring.
test: add Playwright E2E testing and GitHub Actions workflows #1: Modifies globals.css @theme inline blocks and CSS custom property definitions.
docs: project setup guide and README updates #9: Updates dependency versions for Next.js, Biome, and Vercel packages.

Poem

🐰 Tokens reorganised with care and grace,
Config caches now embrace their place,
Imports absolute, no paths unclear,
Lint rules stricter—quality tier!
Hop along to the newest version we cheer! ✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately summarises the main changes: dependency updates, lint configuration, and CSS reorganisation across multiple files.
Description check	✅ Passed	The description comprehensively covers all changeset modifications including caching enablement, dependency bumps, lint improvements, and CSS updates.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch chore/minor-updates-deps-lint

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: ASSERTIVE

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 9d3416d and 986fc9a.

⛔ Files ignored due to path filters (1)

package-lock.json is excluded by !**/package-lock.json

📒 Files selected for processing (5)

app/globals.css (2 hunks)
app/layout.tsx (1 hunks)
biome.json (1 hunks)
next.config.ts (1 hunks)
package.json (2 hunks)

🧰 Additional context used

📓 Path-based instructions (3)

**/*.{tsx,ts}

📄 CodeRabbit inference engine (CLAUDE.md)

**/*.{tsx,ts}: Only add "use client" directive when interactivity is needed
Avoid manual useMemo and useCallback unless profiling shows performance need

Files:

next.config.ts
app/layout.tsx

**/*.{ts,tsx,js,jsx}

📄 CodeRabbit inference engine (CLAUDE.md)

Always use @/ import aliases for imports, including sibling imports (use @/app/fonts not ./fonts)

Files:

next.config.ts
app/layout.tsx

**/*.{css,scss,postcss}

📄 CodeRabbit inference engine (CLAUDE.md)

Use Tailwind CSS v4 with @import "tailwindcss" syntax instead of @tailwind directives

Files:

app/globals.css

🧠 Learnings (4)

📚 Learning: 2025-11-25T18:37:08.183Z

Learnt from: michellepace
Repo: michellepace/nextjs-base PR: 2
File: app/layout.tsx:76-77
Timestamp: 2025-11-25T18:37:08.183Z
Learning: The vercel/analytics and vercel/speed-insights packages have built-in environment detection in "auto" mode by default. They automatically detect development vs production environments using NODE_ENV and similar framework variables, and only send analytics data in production. They no-op during local development, so manual NODE_ENV checks are redundant.

Applied to files:

package.json
app/layout.tsx

📚 Learning: 2025-12-01T11:35:33.165Z

Learnt from: CR
Repo: michellepace/nextjs-base PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-01T11:35:33.165Z
Learning: Use Biome for linting and formatting instead of ESLint and Prettier

Applied to files:

package.json
biome.json

📚 Learning: 2025-12-01T11:35:33.165Z

Learnt from: CR
Repo: michellepace/nextjs-base PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-01T11:35:33.165Z
Learning: Applies to **/*.{ts,tsx,js,jsx} : Always use `@/` import aliases for imports, including sibling imports (use `@/app/fonts` not `./fonts`)

Applied to files:

app/layout.tsx

📚 Learning: 2025-12-01T11:35:33.165Z

Learnt from: CR
Repo: michellepace/nextjs-base PR: 0
File: CLAUDE.md:0-0
Timestamp: 2025-12-01T11:35:33.165Z
Learning: Applies to **/*.{css,scss,postcss} : Use Tailwind CSS v4 with `import "tailwindcss"` syntax instead of `tailwind` directives

Applied to files:

app/layout.tsx
app/globals.css

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

GitHub Check: Run E2E Tests

🔇 Additional comments (8)

package.json (2)
9-9: LGTM! Stricter linting enforced.

Adding --error-on-warnings is a good practice that ensures warnings are addressed promptly and prevents them from accumulating in the codebase.

25-27: @vercel/analytics v1.6.0 does not exist on npm registry—latest published version is v1.5.0.

The pinned version "@vercel/analytics": "^1.6.0" will fail during installation. Update to ^1.5.0 or verify the intended version. The other two dependencies (@vercel/speed-insights@1.3.0 and next@16.0.6) have no known security vulnerabilities.
⛔ Skipped due to learnings
Learnt from: michellepace
Repo: michellepace/nextjs-base PR: 2
File: app/layout.tsx:76-77
Timestamp: 2025-11-25T18:37:08.183Z
Learning: The vercel/analytics and vercel/speed-insights packages have built-in environment detection in "auto" mode by default. They automatically detect development vs production environments using NODE_ENV and similar framework variables, and only send analytics data in production. They no-op during local development, so manual NODE_ENV checks are redundant.
biome.json (1)

2-2: LGTM! Schema version aligned with Biome package.

The schema version update to 2.3.8 correctly aligns with the @biomejs/biome@^2.3.8 package version in devDependencies.

app/layout.tsx (1)

4-4: LGTM! Import alias correctly applied.

The change from relative import "./globals.css" to absolute alias "@/app/globals.css" correctly follows the project's coding guidelines.

Based on coding guidelines and learnings, this project consistently uses @/ aliases for all imports, including siblings.

app/globals.css (3)

6-50: LGTM! Theme tokens correctly registered for Tailwind v4.

The @theme inline block properly registers CSS custom properties as Tailwind utilities, enabling classes like bg-background, text-foreground, font-display, etc. The inline approach correctly embeds values directly rather than using a separate CSS layer.

12-12: LGTM! Modern font fallback improves cross-platform consistency.

Changing the monospace font fallback from "Courier New" to ui-monospace is a best practice that leverages the system's native monospace font, providing better rendering and consistency across platforms.

133-133: LGTM! Comment clarification.

The comment simplification from "text color inherited" to "text color" is clearer and more accurate.

next.config.ts (1)

5-8: The cacheComponents configuration option is fully supported in Next.js 16.0.6 and correctly enables the "use cache" directive, cacheLife(), cacheTag(), and Partial Prerendering features as documented in the comments. No action needed.

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

michellepace and others added 3 commits December 2, 2025 13:51

michellepace merged commit af65b37 into main Dec 2, 2025
7 checks passed

michellepace deleted the chore/minor-updates-deps-lint branch December 2, 2025 13:11

coderabbitai bot mentioned this pull request Dec 10, 2025

chore: add pre-push build step and update dependencies #15

Merged

3 tasks

coderabbitai bot mentioned this pull request Jan 4, 2026

chore: update dependencies #22

Merged

2 tasks

coderabbitai bot mentioned this pull request Feb 4, 2026

chore: update config and dependencies #27

Merged

3 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

chore: minor updates - deps, lint, and CSS organisation#13

chore: minor updates - deps, lint, and CSS organisation#13
michellepace merged 3 commits intomainfrom
chore/minor-updates-deps-lint

michellepace commented Dec 2, 2025

Uh oh!

vercel bot commented Dec 2, 2025

Uh oh!

coderabbitai bot commented Dec 2, 2025 •

edited

Loading

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Conversation

michellepace commented Dec 2, 2025

Summary

Test plan

Uh oh!

vercel bot commented Dec 2, 2025

Uh oh!

coderabbitai bot commented Dec 2, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Release Notes

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Poem

Pre-merge checks and finishing touches

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

coderabbitai bot commented Dec 2, 2025 •

edited

Loading